<template>
    <Card title="基础数据">
        <div class="line">
            <template v-for="item in data" :key="item">
                <FinanceCard class-name="li" :item="item" />
            </template>
        </div>
    </Card>
</template>

<script setup>
import Card from '../components/Card.vue';
import FinanceCard from '../components/FinanceCard.vue';

const data = [
    {
        type: '代理运营商',
        data: 120,
        proportion: -200.32,
        dailyData: 200,
    },
    {
        type: '合作司机',
        data: 120,
        proportion: 0,
        dailyData: 200,
    },
    {
        type: '合作运营商',
        data: 120,
        dailyData: -200,
        proportion: 200.32,
    },
];
</script>

<style scoped lang="css">
:deep(.li) {
    margin-top: 20px !important;
    border: 1px solid #ccc;
}
.line {
    margin-top: 40px;
    align-items: center;
}
</style>
